<!-- author: xuett -->
<!-- date: 2025-07-07 16:32:57 -->
<!-- description: 预览 -->
<template>
  <div class="preview-container">
    <component :is="comName"></component>
    <el-button type="primary" class="back-btn" @click="$router.back()">
      <el-icon><ArrowLeft /></el-icon>
      返回
    </el-button>
  </div>
</template>

<script setup>
import chartComponents from "./components";

const $router = useRouter();
const $route = useRoute();

const comName = computed(() => {
  return chartComponents[$route.query.name];
});
</script>

<style scoped lang="scss">
.preview-container {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  position: relative;
  .back-btn {
    position: absolute;
    bottom: 10px;
    left: 10px;
  }
}
</style>
